{% extends "base.html" %}
{% block head %}
    <title>股票信息管理</title>
    <script>
        $(function () {
            $('#addStock').on('hide.bs.modal', function () {
                $('#stock')[0].reset();
            })
        });
    </script>
    <script type="text/javascript">
        var current_page = 1
        var page_size = 10
        var search = '';
        $(document).ready(function () {
            get_page(1, page_size, '');
        });

        function get_page(page, pagesize, search) {
            info = {page: page, pagesize: pagesize, search: search}
            current_page = page
            $.ajax({
                url: '/stock/list',
                type: 'post',
                cache: false,
                data: JSON.stringify(info),
                success: function (res) {
                    allresult = JSON.parse(res.data);
                    console.log(allresult)
                    $("#tbodycontent").html("");
                    //name, hosts_path, playbook_path, forks
                    for (i = 0; i < allresult.length; i++) {
                        tmpone = '<tr>'
                        tmpone = tmpone + '<td>' + allresult[i]['id'] + '</td>'
                        tmpone = tmpone + '<td><a href="javascript:modify_stock(`' + allresult[i]['stock_code'] + '`)">' + allresult[i]['stock_code'] + '</a></td>'
                        tmpone = tmpone + '<td>' + allresult[i]['stock_name'] + '</td>'
                        tmpone = tmpone + '<td>' + allresult[i]['current_price'] + '</td>'
                        tmpone = tmpone + '<td>' + allresult[i]['pe_ratio'] + '</td>'
                        tmpone = tmpone + '<td>' + allresult[i]['total_value'] / 100000000 + '</td>'
                        tmpone = tmpone + '</tr>'
                        $("#tbodycontent").append(tmpone);
                    }
                    $("#pageinfo").html("");
                    pagedown = '<button type="button" onclick="get_page(' + (page - 1) + ',' + pagesize + ', \'' + search + '\')" class="btn btn-sm">上一页</button>'
                    pageup = '<button type="button" onclick="get_page(' + (page + 1) + ',' + pagesize + ', \'' + search + '\')" class="btn btn-sm">下一页</button>'
                    $("#pageinfo").html("当前：<p style='display: inline;' id='page'>" + page + "/" + res.pages + "页</p>");
                    if (res.page > 1) {
                        $("#pageinfo").append(" " + pagedown);
                    }
                    if (res.page < res.pages) {
                        $("#pageinfo").append(" " + pageup);
                    }
                }
            });

        };

        function get_search() {
            search = $('input#search').val();
            console.log(search);
            get_page(1, page_size, search);
        }

        function get_stock_info() {
            //显示
            $('#loadingModal').modal('show');
            var stock_code = $('#stock_code').val();
            console.log(stock_code)
            var r = /^[036]\d{5}$/;
            if (r.test(stock_code)) {
                var param = {stock_code: stock_code}
                $.ajax({
                    url: '/stock/get_stock_web',
                    type: 'post',
                    cache: false,
                    data: JSON.stringify(param),
                    success: function (res) {
                        var stock_info = JSON.parse(res)
                        console.log(stock_info)
                        $('#stock_name').val(stock_info.stock_name);
                        $('#stock_type').val(stock_info.stock_type);
                        $('#issue_price').val(stock_info.issue_price);
                        $('#reg_capital').val(stock_info.reg_capital);
                        $('#address').val(stock_info.address);
                        $('#company_name').val(stock_info.company_name);
                        $('#company_brief').val(stock_info.company_brief);
                        $('#total_value').val(stock_info.total_value);
                        $('#pe_ratio').val(stock_info.pe_ratio);
                        $('#current_price').val(stock_info.current_price);
                        $('#loadingModal').modal('hide');
                    }
                });
            } else {
                alert('股票代码格式不正确！')
                $('#loadingModal').modal('hide');
            }
            $('#loadingModal').modal('hide');
        }

        //添加与修改股票信息数据到数据库
        function add_stock() {
            var stock_id = $('#stock_id').val();
            var stock_code = $('#stock_code').val();
            var company_name = $('#company_name').val();
            var stock_name = $('#stock_name').val();
            var stock_type = $('#stock_type').val();
            var issue_price = $('#issue_price').val();
            var reg_capital = $('#reg_capital').val();
            var address = $('#address').val();
            var company_brief = $('#company_brief').val();
            var total_value = $('#total_value').val();
            var pe_ratio = $('#pe_ratio').val();
            var current_price = $('#current_price').val();
            var param = {
                stock_id: stock_id,
                stock_code: stock_code,
                stock_name: stock_name,
                stock_type: stock_type,
                issue_price: issue_price,
                reg_capital: reg_capital,
                address: address,
                company_name: company_name,
                company_brief: company_brief,
                total_value: total_value,
                pe_ratio: pe_ratio,
                current_price: current_price
            }
            console.log(param)
            $.ajax({
                url: '/stock/add_stock',
                type: 'post',
                cache: false,
                data: JSON.stringify(param),
                success: function (res) {
                    console.log(res)
                    $('#stock')[0].reset();
                    $("#addStock").modal('hide');
                    get_page(current_page, page_size, search)
                },
                error: function (XmlHttpRequest, textStatus, errorThrown) {
                    alert("用户添加失败;" + XmlHttpRequest.responseText);
                }
            });
        }

        function modify_stock(stock_code) {
            console.log(stock_code)
            var param = {
                stock_code: stock_code
            }
            console.log(param)
            $.ajax({
                url: '/stock/get_stock',
                type: 'post',
                cache: false,
                data: JSON.stringify(param),
                success: function (res) {
                    var stock_info = JSON.parse(res)
                    console.log(stock_info)
                    $('#stock_id').val(stock_info.id);
                    $('#stock_code').val(stock_info.stock_code);
                    $('#stock_name').val(stock_info.stock_name);
                    $('#company_name').val(stock_info.company_name);
                    $('#stock_type').val(stock_info.stock_type);
                    $('#issue_price').val(stock_info.issue_price);
                    $('#reg_capital').val(stock_info.reg_capital);
                    $('#address').val(stock_info.address);
                    $('#company_brief').val(stock_info.company_brief);
                    $('#total_value').val(stock_info.total_value);
                    $('#pe_ratio').val(stock_info.pe_ratio);
                    $('#current_price').val(stock_info.current_price);
                    $("#addStock").modal('show');
                },
                error: function (XmlHttpRequest, textStatus, errorThrown) {
                    alert("股票信息获取失败;" + XmlHttpRequest.responseText);
                }
            });
        }

        function delete_stock() {
            var stock_code = $('#stock_code').val();
            if (confirm("确认是股票代码为：" + stock_code + "的股票？")) {
                var stock_id = $('#stock_id').val();
                var param = {stock_id: stock_id}
                console.log(param)
                $.ajax({
                    url: '/stock/delete',
                    type: 'post',
                    cache: false,
                    data: JSON.stringify(param),
                    success: function (res) {
                        console.log(res)
                        $('#stock')[0].reset();
                        $("#addStock").modal('hide');
                        get_page(current_page, page_size, search)
                    }
                });
            }
        }
    </script>
{% endblock %}

{% block body %}
    <div class="container">
        <div class="row">
            <div class="col">
                <div class="input-group mb-3" style="width: 400px;">
                    <input type="text" class="form-control" placeholder="查询条件"
                           aria-label="search" aria-describedby="basic-addon2"
                           id="search">
                    <button type="button" class="btn btn-outline-info" style="margin-left: 10px" onclick="get_search()">
                        查询
                    </button>
                    <button type="button" class="btn btn-outline-primary" style="margin-left: 10px;" data-toggle="modal"
                            data-target="#addStock">
                        添加股票
                    </button>
                </div>

                <table class="table table-bordered table-hover">
                    <thead>
                    <th style="width: 60px;text-align: center">序号</th>
                    <th style="width: 100px;text-align: center">股票代码</th>
                    <th style="width: 150px;text-align: center">股票名称</th>
                    <th style="width: 120px;text-align: center">价格(元)</th>
                    <th style="width: 120px;text-align: center">市赢率</th>
                    <th style="width: 150px;text-align: center">总市值(亿)</th>
                    </thead>
                    <tbody id="tbodycontent">

                    </tbody>
                </table>
                <p id="pageinfo"></p>
            </div>
        </div>
    </div>
    <!-- 添加股票信息模态框（Modal） -->
    <div class="modal fade bs-example-modal-lg" id="addStock" tabindex="-1" role="dialog" aria-labelledby="新增股票"
         aria-hidden="true">
        <div class="modal-dialog modal-lg">
            <div class="modal-content">
                <div class="modal-header">
                    <h4 class="modal-title" id="myModalLabel">
                        股票信息
                    </h4>
                    <button type="button" class="close" data-dismiss="modal" aria-hidden="true">
                        &times;
                    </button>
                </div>
                <div class="modal-body">
                    <form role="form" id="stock">
                        <div class="row">
                            <div style="width: 32%">
                                <div class="input-group mb-3" style="margin-left: 5px">
                                    <div class="input-group-prepend">
                                        <span class="input-group-text" id="basic-addon1">记录序号：</span>
                                    </div>
                                    <input type="text" class="form-control" id="stock_id"
                                           aria-describedby="basic-addon1" disabled>
                                </div>
                            </div>
                            <div style="width: 32%">
                                <div class="input-group mb-3" style="margin-left: 10px">
                                    <div class="input-group-prepend">
                                        <span class="input-group-text" id="basic-addon1">股票代码：</span>
                                    </div>
                                    <input type="text" class="form-control" id="stock_code"
                                           aria-describedby="basic-addon1">
                                </div>
                            </div>
                            <div style="width: 33%">
                                <div class="input-group mb-3" style="margin-left: 15px">
                                    <div class="input-group-prepend">
                                        <span class="input-group-text" id="basic-addon1">股票名称：</span>
                                    </div>
                                    <input type="text" class="form-control" id="stock_name"
                                           aria-describedby="basic-addon1">
                                </div>
                            </div>
                            <div style="width: 49%">
                                <div class="input-group mb-3" style="margin-left: 5px">
                                    <div class="input-group-prepend">
                                        <span class="input-group-text" id="basic-addon1">公司名称：</span>
                                    </div>
                                    <input type="text" class="form-control" id="company_name"
                                           aria-describedby="basic-addon1">
                                </div>
                            </div>
                            <div style="width: 49%">
                                <div class="input-group mb-3" style="margin-left: 10px">
                                    <div class="input-group-prepend">
                                        <span class="input-group-text" id="basic-addon1">股票类型：</span>
                                    </div>
                                    <input type="text" class="form-control" id="stock_type"
                                           aria-describedby="basic-addon1">
                                </div>
                            </div>
                            <div style="width: 49%">
                                <div class="input-group mb-3" style="margin-left: 5px">
                                    <div class="input-group-prepend">
                                        <span class="input-group-text" id="basic-addon1">注册资本：</span>
                                    </div>
                                    <input type="text" class="form-control" id="reg_capital"
                                           aria-describedby="basic-addon1">
                                </div>
                            </div>
                            <div style="width: 49%">
                                <div class="input-group mb-3" style="margin-left: 10px">
                                    <div class="input-group-prepend">
                                        <span class="input-group-text" id="basic-addon1">最新市值：</span>
                                    </div>
                                    <input type="text" class="form-control" id="total_value"
                                           aria-describedby="basic-addon1">
                                </div>
                            </div>
                            <div style="width: 32%">
                                <div class="input-group mb-3" style="margin-left: 5px">
                                    <div class="input-group-prepend">
                                        <span class="input-group-text" id="basic-addon1">最新价格：</span>
                                    </div>
                                    <input type="text" class="form-control" id="current_price"
                                           aria-describedby="basic-addon1">
                                </div>
                            </div>
                            <div style="width: 32%">
                                <div class="input-group mb-3" style="margin-left: 10px">
                                    <div class="input-group-prepend">
                                        <span class="input-group-text" id="basic-addon1">市 赢 率：</span>
                                    </div>
                                    <input type="text" class="form-control" id="pe_ratio"
                                           aria-describedby="basic-addon1">
                                </div>
                            </div>
                            <div style="width: 33%">
                                <div class="input-group mb-3" style="margin-left: 15px">
                                    <div class="input-group-prepend">
                                        <span class="input-group-text" id="basic-addon1">发行价格：</span>
                                    </div>
                                    <input type="text" class="form-control" id="issue_price"
                                           aria-describedby="basic-addon1">
                                </div>
                            </div>
                            <div style="width: 98%">
                                <div class="input-group mb-3" style="margin-left: 5px">
                                    <div class="input-group-prepend">
                                        <span class="input-group-text" id="basic-addon1">公司地址：</span>
                                    </div>
                                    <input type="text" class="form-control" id="address"
                                           aria-describedby="basic-addon1">
                                </div>
                            </div>
                            <div style="width: 98%">
                                <div class="input-group mb-3" style="margin-left: 5px">
                                    <div class="input-group-prepend">
                                        <span class="input-group-text" id="basic-addon1">公司简介：</span>
                                    </div>
                                    <textarea class="form-control" id="company_brief" rows="3"></textarea>
                                </div>
                            </div>
                        </div>
                        <div class="modal-footer">
                            <button type="button" class="btn btn-info" onclick="get_stock_info()">抓取股票信息</button>
                            <button type="button" class="btn btn-primary" onclick="add_stock()">保存</button>
                            <button type="button" class="btn btn-warning" onclick="delete_stock()">删除</button>
                            <button type="button" class="btn btn-default" data-dismiss="modal">取消</button>
                        </div>
                    </form>
                </div>
            </div><!-- /.modal-content -->
        </div><!-- /.modal -->
    </div>

    <!-- loading -->
    <div class="modal fade" id="loadingModal" tabindex="-1" zindex=1111 role="dialog" aria-labelledby="myModalLabel"
         data-backdrop='static' style="margin-top: 200px;">
        <div class="modal-dialog" role="document">
            <div class="modal-content">
                <div class="modal-header">
                    <h4 class="modal-title" id="myModalLabel">提示</h4>
                </div>
                <div class="modal-body" style="color: #856404">
                    数据获取中，请稍候...<span id="result"></span>
                </div>
            </div>
        </div>
    </div>
{% endblock %}